<template>
  <!--视图-->
  <div>

    <el-dialog title="用户部门统计图" :visible.sync="dialogShowFormVisible">
      <div id="main" style="width: 500px;height: 500px">

      </div>
    </el-dialog>

  </div>



</template>

<script>
import * as echarts from 'echarts';
export default {
  name: "UserBarChartView",
  data() {//属性
    return {
      dialogShowFormVisible:false,
      barChart:[],
    }
  }, methods: {//自定义方法

    zzt(){

      this.axios.post("system/user/barChart").then(res=>{
        console.log(res);
        this.barChart=res.data.data;
        var y=[];
        var x=[];

        for (let i = 0; i < this.barChart.length; i++) {
          var ydata=this.barChart[i].ydata;
          y.push(ydata)

          var xdata=this.barChart[i].xdata;
          x.push(xdata)
        }

        var chartDom = document.getElementById('main');
        var myChart = echarts.init(chartDom);
        var option;

        option = {
          xAxis: {
            type: 'category',
            data: x
          },
          yAxis: {
            type: 'value'
          },
          series: [
            {
              data: y,
              type: 'line'
            }
          ]
        };

        option && myChart.setOption(option);

      })
    }
  }, created() { //钩子函数

  }
}
</script>

<style scoped>

</style>